import 'dart:ui';

import 'package:airbnb_clone/internal/login_check/login_check.dart';
import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';

import '../../../constant/constant.dart';

class FavoriteScreen extends StatefulWidget {
  const FavoriteScreen({super.key});

  @override
  State<FavoriteScreen> createState() => _FavoriteSreenState();
}

class _FavoriteSreenState extends State<FavoriteScreen> {
  bool _isLogin = true;
  @override
  void initState() {
    super.initState();
    if (!LoginCheck.check()) {
      _isLogin = false;
    }
  }

  @override
  Widget build(BuildContext context) {
    // final textTheme = Theme.of(context).textTheme;
    final size = MediaQuery.sizeOf(context);
    List<Map<String, dynamic>> listData = [
      {"name": "genshinImpact", "id": 1},
      {"name": "genshinImpact", "id": 2},
      {"name": "genshinImpact", "id": 3},
    ];
    return Stack(
      children: [
        Container(
            color: Colors.grey[200],
            height: size.height * 0.13,
            child: articleSreachInput(context)),
        !_isLogin
            ? needLoginWidget(context)
            : Positioned(
                top: size.height * 0.13,
                height: size.height * 0.85,
                width: size.width,
                child: SingleChildScrollView(
                  child: Container(
                    color: Colors.white,
                    child: Column(
                      children: [
                        Container(
                          height: size.height * 0.85,
                          decoration: BoxDecoration(
                            gradient: LinearGradient(
                                begin: Alignment.topCenter,
                                end: Alignment.bottomCenter,
                                colors: bgGradientColor),
                            // borderRadius:
                            // BorderRadius.vertical(top: Radius.circular(80))
                          ),
                          child: Column(
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: [
                                // favoriteCatagory(_listData),
                                allCategory(listData),
                                Expanded(child: Container())
                              ]),
                        )
                      ],
                    ),
                  ),
                ),
              )
      ],
    );
  }
}

Container allCategory(List<Map<String, dynamic>> listData) {
  return Container(
    margin: const EdgeInsets.only(top: 20),
    padding: const EdgeInsets.symmetric(horizontal: 20),
    height: 430,
    child: Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: [
        const Text(
          "关注的文章",
          style: TextStyle(fontSize: 20, fontWeight: FontWeight.w600),
        ),
        SizedBox(
          // color: Colors.amber,
          height: 400,
          child: ListView.builder(
              padding: EdgeInsets.zero,
              shrinkWrap: true,
              itemCount: listData.length,
              itemBuilder: (context, index) {
                return GestureDetector(
                  onTap: () {
                    // 路由跳转
                    context.pushNamed("article",
                        pathParameters: {"id": "${listData[index]["id"]}"});
                  },
                  child: Container(
                    height: 75,
                    margin: const EdgeInsets.only(bottom: 8),
                    padding: const EdgeInsets.all(8),
                    decoration: BoxDecoration(
                        color: Colors.white.withOpacity(0.9),
                        borderRadius: BorderRadius.circular(8)),
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.start,
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Container(
                          // width: 50,
                          // height: 50,
                          margin: const EdgeInsets.only(right: 8),
                          decoration: BoxDecoration(
                              borderRadius: BorderRadius.circular(4)),
                          child: ClipRRect(
                            borderRadius: BorderRadius.circular(8),
                            child: Image.network(
                              "",
                              errorBuilder: (context, error, stackTrace) {
                                return Image.asset(
                                    "assets/images/netError.jpg");
                              },
                            ),
                          ),
                        ),
                        Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            Text(
                              listData[index]["name"],
                              style:
                                  const TextStyle(fontWeight: FontWeight.w700),
                            ),
                            Text(
                              listData[index]["name"],
                            ),
                          ],
                        )
                      ],
                    ),
                  ),
                );
              }),
        ),
      ],
    ),
  );
}

Container favoriteCatagory(List<Map<String, int>> listData) {
  return Container(
    height: 120,
    margin: const EdgeInsets.only(top: 70),
    padding: const EdgeInsets.symmetric(horizontal: 20),
    child: Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: [
        const Text(
          "关注的吧",
          style: TextStyle(fontSize: 20, fontWeight: FontWeight.w600),
        ),
        SizedBox(
          height: 90,
          child: ListView.builder(
              padding: const EdgeInsets.only(right: 1),
              scrollDirection: Axis.horizontal,
              itemCount: listData.length,
              itemBuilder: (context, index) {
                return Container(
                  margin: const EdgeInsets.fromLTRB(8, 0, 0, 0),
                  padding: const EdgeInsets.all(8),
                  width: 80,
                  height: 30,
                  decoration: BoxDecoration(
                      color: Colors.white.withOpacity(0.9),
                      borderRadius: BorderRadius.circular(10)),
                  child: Column(
                    children: [
                      Container(
                        height: 50,
                        width: 50,
                        margin: const EdgeInsets.only(bottom: 4),
                        decoration: BoxDecoration(
                            borderRadius: BorderRadius.circular(8)),
                        child: ClipRRect(
                          borderRadius: BorderRadius.circular(8),
                          child: Image.network(
                            "",
                            errorBuilder: (context, error, stackTrace) {
                              return Image.asset("assets/images/netError.jpg");
                            },
                          ),
                        ),
                      ),
                      const Text(
                        "listData",
                        maxLines: 1,
                        overflow: TextOverflow.fade,
                      )
                    ],
                  ),
                );
              }),
        ),
      ],
    ),
  );
}

SizedBox articleSreachInput(BuildContext context) {
  return SizedBox(
    height: 70,
    child: Stack(
      children: [
        ClipRect(
          child: BackdropFilter(
              filter: ImageFilter.blur(sigmaX: 40, sigmaY: 40),
              child: Container(
                padding: const EdgeInsets.all(20),
                decoration: BoxDecoration(
                  gradient: LinearGradient(
                    begin: Alignment.topCenter,
                    end: Alignment.bottomCenter,
                    colors: topBarBgColor,
                  ),
                ),
              )),
        ),
        Positioned(
          left: 16.0,
          right: 50.0,
          top: 50.0,
          child: GestureDetector(
            onTap: () => context.pushNamed('booking-details'),
            child: Hero(
              tag: 'planning',
              child: Container(
                padding: const EdgeInsets.symmetric(
                  horizontal: 16.0,
                  vertical: 8.0,
                ),
                decoration: BoxDecoration(
                  color: appWhite,
                  border: Border.all(color: appGrey, width: 1.0),
                  borderRadius: BorderRadius.circular(32.0),
                  boxShadow: [
                    BoxShadow(
                      color: const Color.fromARGB(255, 119, 120, 122)
                          .withOpacity(0.4),
                      blurRadius: 4.0,
                      spreadRadius: 0.0,
                      offset: const Offset(1, 1.0),
                    )
                  ],
                ),
                child: Row(
                  children: [
                    const Icon(Icons.search),
                    const SizedBox(width: 8.0),
                    Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text(
                          'Search Belong',
                          style: Theme.of(context)
                              .textTheme
                              .bodyMedium!
                              .copyWith(fontWeight: FontWeight.bold),
                        ),
                      ],
                    )
                  ],
                ),
              ),
            ),
          ),
        ),
      ],
    ),
  );
}

Widget needLoginWidget(BuildContext context) {
  return GestureDetector(
    child: Center(
      child: BackdropFilter(
        filter: ImageFilter.blur(sigmaX: 5.0, sigmaY: 5.0),
        child: Container(
          height: 195,
          width: 300,
          padding: const EdgeInsets.fromLTRB(20, 10, 20, 10),
          decoration: BoxDecoration(
              color: Colors.white, borderRadius: BorderRadius.circular(20)),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Text(
                "用户未登录",
                style: titleTextStyle,
              ),
              Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  TextButton(
                    onPressed: () {
                      context.pushNamed("login");
                    },
                    style: normalButtonStyle,
                    child: Text(
                      "点击登录",
                      style: normalTextStyle,
                    ),
                  ),
                ],
              )
            ],
          ),
        ),
      ),
    ),
  );
}
